<template>
  <div class="p16 flex-column-null-between container" style="width: 98%;">

    <div style="background-color: white; width: 100%;align-content: center" >
      <div style="width: 98%;margin-left: 1%">
        <el-tabs v-model="activeTab" @tab-click="handleClick">
          <el-tab-pane label="我发起的" name="first"><MyStartInstance ref="myStartInstance"/></el-tab-pane>
          <el-tab-pane label="我的待办" name="second"><MyToDo ref="myToDo"/></el-tab-pane>
          <el-tab-pane label="我的已办" name="third"><MyHasDo ref="myHasDo"/></el-tab-pane>
          <el-tab-pane label="我的备案" name="four"><MyNode ref="myNode"/></el-tab-pane>
        </el-tabs>

      </div>
    </div>
  </div>
</template>

<script>
import MyToDo from "@v/todo/components/MyToDo.vue";
import MyStartInstance from "@v/todo/components/MyStartInstance.vue";
import MyHasDo from "@v/todo/components/MyHasDo.vue";
import MyNode from "@v/todo/components/MyNode.vue";

export default {
  components:{
    MyNode,
    MyHasDo,
    MyStartInstance,
    MyToDo
  },
  data() {
    return {
      activeTab: 'first',
    }
  },
  created() {
  },
  methods: {
    handleClick(tab){

    }

  },

}
</script>


<style src="../css/index.scss" lang="scss"></style>
<style lang="scss" scoped>
.search-item{
  float: left;
  margin: 0 20px 20px 0;
  span{
    color: #606266;
    font-size: 14px;
    margin-right: 0px;
  }
}
.workProcessClass{
  height: 500px;
  overflow: auto;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  background: white;
}
</style>
